import { fileURLToPath, URL } from 'node:url'
import path from 'path'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// import postcssViewport from 'postcss-px-to-viewport-8-plugin'
import postcssForver from 'postcss-mobile-forever'
import autoprefixer from 'autoprefixer'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import viteCompression from 'vite-plugin-compression'

const pathSrc = path.resolve(__dirname, 'src')

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    AutoImport({
      resolvers: [ElementPlusResolver()],
      dts: path.resolve(pathSrc, 'auto-imports.d.ts')
    }),
    Components({
      resolvers: [ElementPlusResolver()],
      dts: path.resolve(pathSrc, 'components.d.ts')
    }),
    // 开启压缩需要服务器配合配置一下
    viteCompression({
      verbose: true, // 是否在控制台输出压缩结果, 默认即可
      disable: true, // 是否禁用, 默认即可
      deleteOriginFile: false, //删除源文件
      threshold: 10240, // 体积大于 10240 会被压缩(单位 b)
      algorithm: 'gzip', // 压缩算法 可选 [ 'gzip' , 'brotliCompress' ,'deflate' , 'deflateRaw']
      ext: '.gz' // 生成的压缩包后缀
    })
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  css: {
    postcss: {
      plugins: [
        autoprefixer({
          overrideBrowserslist: [
            'Android 4.1',
            'iOS 7.1',
            'Chrome > 31',
            'ff > 31',
            'ie >= 8'
            //'last 10 versions', // 所有主流浏览器最近2个版本
          ],
          grid: true
        }),
        // postcssViewport({
        //   unitToConvert: 'px', // 要转化的单位
        //   viewportWidth: 1920, // UI设计稿的宽度
        //   unitPrecision: 6, // 转换后的精度，即小数点位数
        //   propList: ['*'], // 指定转换的css属性的单位，*代表全部css属性的单位都进行转换
        //   viewportUnit: 'vw', // 指定需要转换成的视窗单位，默认vw
        //   fontViewportUnit: 'vw', // 指定字体需要转换成的视窗单位，默认vw
        //   selectorBlackList: ['keep-px'], // 指定不转换为视窗单位的类名，
        //   minPixelValue: 1, // 默认值1，小于或等于1px则不进行转换
        //   mediaQuery: true, // 是否在媒体查询的css代码中也进行转换，默认false
        //   replace: true, // 是否转换后直接更换属性值
        //   exclude: [/node_modules/], // 设置忽略文件，用正则做目录名匹配
        //   landscape: false, // 是否处理横屏情况
        //   landscapeUnit: 'vw', // 横屏时使用的单位
        //   landscapeWidth: 1920 // 横屏时使用的视口宽度
        // }),
        postcssForver({
          rootSelector: '#app',
          mobileUnit: 'vw',
          viewportWidth: 1920,
          maxDisplayWidth: 1920,
          desktopWidth: 1920,
          unitPrecision: 6,
          border: false,
          disableDesktop: true,
          disableLandscape: true,
          exclude: [/node_modules/],
          rootContainingBlockSelectorList: ['keep-px']
        })
      ]
    }
  },
  server: {
    port: 9527,
    open: true,
    proxy: {
      '/api': {
        // target: 'https://huggingface.mpcheshi.com/',
        target: 'http://192.168.10.24:9088/',
        // target: 'http://192.168.60.95:9088/',
        changeOrigin: true,
        rewrite: path => path.replace(/^\/api/, '')
      }
    }
  },
  build: {
    outDir: 'dist', // 指定打包文件的输出目录
    assetsDir: './static', // 指定静态资源目录
    emptyOutDir: true, //打包时清空上一次构建生成的目录
    sourcemap: false, // 是否生成源代码映射文件
    chunkSizeWarningLimit: 1500, // 触发警告的 chunk 大小
    assetsInlineLimit: 1024 * 5, // 小于此阈值的导入或引用资源将内联为 base64 编码，以避免额外的 http 请求。默认：4kb
    cssMinify: true, // 是否开启 CSS 压缩
    cssCodeSplit: true, // 拆分 CSS 代码
    rollupOptions: {
      input: 'index.html',
      output: {
        // 静态资源打包做处理
        chunkFileNames: 'static/js/[name]-[hash].js',
        entryFileNames: 'static/js/[name]-[hash].js',
        assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
        manualChunks(id) {
          if (id.includes('node_modules')) {
            return id.toString().split('node_modules/')[1].split('/')[0].toString()
          }
        }
      }
    },
    minify: 'terser', // 是否启用压缩
    terserOptions: {
      compress: {
        drop_console: true, // 打包时清除 console 相关代码
        drop_debugger: true // 打包时清除 debug 相关代码
      },
      output: {
        comments: true // 去掉注释内容
      }
    }
  }
})
